{% extends 'base.html' %}

{% block title %} report {% endblock %}

{#导航标题#}
{% block navtitle %}报告列表{% endblock %}

{# 导航菜单 #}
{% block navmenu %}

    <a class="btn" onclick="addReport()">添加报告</a>


{% endblock %}

{% block container %}



    <div class="row" id="reports">
{#    vue用 #}
    <report-item
        v-for="report in reports"
        v-bind:key="report.id"
        v-bind:report="report"
{#        监听下级的a标签点击后抛出的edit事件，调用edit函数处理#}
        v-on:edit="edit"
        v-on:delete_report="delete_report"
    ></report-item>


    </div>






{#    创建报告 框#}
<div class="modal" id="modal-create-report">


<div class="modal-content">
    <h4 >创建报告 </h4>

    <div class="row">
{#        报告模板#}
        <div class="col input-field s4">

            <select id="report_template">
            {% for templatekey,name in templates.items() %}
                <option value="{{ templatekey }}">{{ name }}</option>
            {% endfor %}
        </select>
        <lael for="report_template">报告模板</lael>
        </div>

    <div class="col input-field s4">
            <select id="report_record">
                 {% for recordid,text in records.items() %}
                <option value="{{ recordid }}">{{ text }}</option>
            {% endfor %}
            </select>
                <label for="report_record">模板数据源</label>
        </div>

    </div>

<div class="row">
    <div class="col s6">
        <label for="report_title">报告标题</label>
        <input id="report_title"/>
    </div>
</div>

</div>

<div class="modal-footer">

        <a onclick="createReport()" class="modal-close btn">创建</a>
        <a class="btn modal-close"> 关闭</a>


</div>

</div>



{% endblock %}


{% block script %}
        <script type="text/javascript" src="{{ url_for('static',filename='report/report.js') }}"></script>

        <script type="text/javascript">



        </script>
{% endblock %}
